
<!DOCTYPE>
<!--suppress ALL -->
<html lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<title>修改密码</title>
		<!-- basic styles -->

		<link href="assets-ace/css/bootstrap.min.css" rel="stylesheet" />
		<!--<link rel="stylesheet" href="assets-ace/css/font-awesome.min.css" />-->

		<!--[if IE 7]>
		  <!--<link rel="stylesheet" href="assets/css/font-awesome-ie7.min.css" />-->
		<![endif]-->

		<!-- page specific plugin styles -->

		<!--<link rel="stylesheet" href="assets-ace/css/jquery-ui-1.10.3.custom.min.css" />-->
		<!--<link rel="stylesheet" href="assets-ace/css/jquery.gritter.css" />-->
		<!--<link rel="stylesheet" href="assets-ace/css/bootstrap-editable.css" />-->
		<!-- ace styles -->

		<link rel="stylesheet" href="assets-ace/css/ace.min.css" />
		<!--<link rel="stylesheet" href="assets-ace/css/ace-rtl.min.css" />-->
		<!--<link rel="stylesheet" href="assets-ace/css/ace-skins.min.css" />-->

		<!--[if lte IE 8]>
		  <!--<link rel="stylesheet" href="assets/css/ace-ie.min.css" />-->
		<![endif]-->

		<!-- inline styles related to this page -->
		<!-- ace settings handler -->
		<!--<script src="assets-ace/js/ace-extra.min.js"></script>-->
		<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
		<!--[if lt IE 9]>
		<!--<script src="assets/js/html5shiv.js"></script>-->
		<!--<script src="assets/js/respond.min.js"></script>-->
		<![endif]-->
		<script type="text/javascript">
            window.jQuery || document.write("<script src='assets-ace/js/jquery-2.0.3.min.js'>"+"<"+"/script>");
		</script>

</head>

<body>
	<div class="user-profile row">
	<div class="col-sm-offset-1 col-sm-10">
	<form class="form-horizontal">
		<div class="tabbable">
			<ul class="nav nav-tabs padding-16">
				<li class="active">
					<a data-toggle="tab" href="#edit-password">
						<i class="blue icon-key bigger-125"></i>
						更改密码
					</a>
				</li>
			</ul>
			<script type="text/javascript">
			function checkPassword(oldpassword) {
                var pwdMsg = document.getElementById("pwdMsg");
                flag1 = false;
			    if(sessionStorage.getItem("staff")==null){
                    alert("您现在处于游客状态，请登录后重试！");
                    return;
				}
                var password = JSON.parse(sessionStorage.getItem("staff")).password;
                if (password == oldpassword) {
                    pwdMsg.innerHTML = "<font color='green'>原密码输入正确</font>";
                    flag1 = true;
                    $("#submit").attr("disabled",false);
                } else {
                    pwdMsg.innerHTML = "<font color='red'>原密码输出错误，请重试！</font>";
                }
            }
			
			</script>
			<div id="edit-password" class="tab-pane">
			
				<div class="space-6"></div>
				
				<div class="form-group">
					<label class="col-sm-3 control-label no-padding-right" for="form-field-pass1">原密码：</label>

					<div class="col-sm-9">
						<input type="password" id="oldpassword" name="oldpassword" onblur="checkPassword(this.value);"/>
						<span id="pwdMsg" style="font-size: 12px"></span>
					</div>
				</div>
			
				<div class="space-3"></div>

				<script type="text/javascript">
					function checkNewPassword(newpassword)
					{
						flag2=false;
						var regx=/^[a-zA-Z0-9]{6,10}$/;
						var newPwdMsg=document.getElementById("newPwdMsg");

						if((regx.exec(newpassword))!=null)
						{
							newPwdMsg.innerHTML="<font color='green'>新密码输入合法！</font>";
							flag2=true;
						}else
						{
							newPwdMsg.innerHTML="<font color='red'>新密码必须为6~12位字符串</font>";
						}
					}
				</script>
				<div class="form-group">
					<label class="col-sm-3 control-label no-padding-right" for="form-field-pass1">新密码：</label>

					<div class="col-sm-9">
						<input type="password" id="newpassword" name="newpassword" onblur="checkNewPassword(this.value);"/>
						<span id="newPwdMsg" style="font-size: 12px"></span>
					</div>
				</div>

				<div class="space-3"></div>

				<script type="text/javascript">
					function Manager(repassword)
					{
						flag3=false;
						newpassword = document.getElementById("newpassword").value;
		    			repassword = document.getElementById("repassword").value;

		    			var rePwdMsg=document.getElementById("rePwdMsg");
						
						if(newpassword == repassword && newpassword!="")
						{
							rePwdMsg.innerHTML="<font color='green'>输入正确!</font>";
							flag3=true;
						}else
						{
							rePwdMsg.innerHTML="<font color='red'>两次输入密码错误，请重试！</font>";
						}
					}

				</script>
				
				<div class="form-group">
					<label class="col-sm-3 control-label no-padding-right" for="form-field-pass2">确认密码：</label>

					<div class="col-sm-9">
						<input type="password" id="repassword" name="repassword" onblur="Manager(this.value);"/>
						<span id="rePwdMsg" style="font-size: 12px"></span>
					</div>
				</div>
			</div>
		</div>
		<script type="text/javascript">
			function Submit() {
                id=JSON.parse(sessionStorage.getItem("staff")).id;
                if (flag1 == true && flag2 == true && flag3 == true) {
                    var xhr = new XMLHttpRequest();
                    xhr.onreadystatechange = function () {
                        if (xhr.readyState == 4) {
                            if (xhr.status == 200) {
                                if (xhr.responseText == 'true') {
                                    eval("var json="+sessionStorage.getItem("staff"));
									json.password=newpassword;
                                    sessionStorage.setItem("staff",JSON.stringify(json));
                                    alert("密码修改成功！");
                                } else {
                                    alert("密码修改失败，请重试");
                                }
                            } else {
                                alert(xhr.status);
                            }
                        }
                    }
                    xhr.withCredentials=true;
                    xhr.open("post", "http://localhost:8080/staff/updatePassword", true);
                    xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=UTF-8");
                    xhr.send("password="+ newpassword+"&id="+id);
                }
                else
                {
                    alert("密码修改失败！请重试！");
                }
            }
		</script>
		<div class="clearfix form-actions">
			<div class="col-md-offset-2 col-md-9">
			
				<button class="btn btn-info" type="button" onclick="Submit()" disabled="true" id="submit">
					<i class="icon-ok bigger-110"></i>
					确认
				</button>

				&nbsp; &nbsp;
				<button class="btn" onreset="false">
					<i class="icon-undo bigger-110"></i>
					重置
				</button>
			</div>
		</div>
	</form>
	</div>
	</div>

</body>
</html>
